import * as Matter from 'matter-js';
import * as PIXI from "pixi.js";
import { App } from '../system/App';
// [10]
import { Diamond } from './Diamond';

// [/10]

export class Ground {
  constructor(x) {
    // [10]
    // [/10]
    this.width = window.innerWidth * 4;
    this.height = 10;

    this.createContainer(x);

    this.createBody();
  }


  createBody() {
    console.log(this.container.x, this.container.y)
    this.body = Matter.Bodies.rectangle(
      -10,
      this.height / 2 + this.container.y,
      this.width,
      this.height,
      {
        friction: 1,
        isStatic: true,
        render: {
          fillStyle: 'red',
          strokeStyle: 'red'
        }
      });
    // console.log(`this.body.x`, this.body)
    Matter.World.add(App.physics.world, this.body);
    this.body.ground = this;
  }

  createContainer(x) {
    this.container = new PIXI.Container();
    this.container.x = x;
    this.container.y = window.innerHeight - this.height - 100;
  }


  // 06
  move() {
    if (this.body) {
      Matter.Body.setPosition(this.body, {x: this.body.position.x + this.dx, y: this.body.position.y});
      this.container.x = this.body.position.x - this.width / 2;
      this.container.y = this.body.position.y - this.height / 2;
    }
  }

  destroy() {
    Matter.World.remove(App.physics.world, this.body);
    // this.diamonds.forEach(diamond => diamond.destroy());
    this.container.destroy();
  }
}